<!DOCTYPE html>
<html lang="en">
<head>
    <!-- Generated using the ComfyUI Prompt Combinator nodes (https://github.com/lquesada/ComfyUI-Prompt-Combinator) -->
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Image Gallery</title>
    <style>
        html {
            overflow-y: scroll;
        }
        body {
            font-family: Arial, sans-serif;
        }
        .header {
            font-size: 70%;
            text-align: right;
        }
        .buttons {
            margin-bottom: 15px;
            text-align: center;
        }
        .button {
            display: inline-block;
            padding: 10px 20px;
            margin: 5px;
            border: 1px solid #ccc;
            border-radius: 5px;
            cursor: pointer;
            user-select: none;
        }
        .button.selected {
            background-color: #007bff;
            color: white;
        }
        .button.disabled {
            background-color: #e0e0e0;
            color: #a0a0a0;
        }
        .button.selected-disabled {
            background-color: #ff6666;
            color: white;
        }
        .image-container {
            text-align: center;
            margin-top: 20px;
            display: flex;
            justify-content: center;
            align-items: center;
            flex-direction: column;
        }
        .image-container img {
            display: block;
        }
        .prompt {
            margin-top: 20px;
        }
        .filename {
            margin-top: 20px;
            font-size: 80%;
        }
        .zoom-controls {
            text-align: center;
            margin: 20px 0;
        }
        .zoom-controls input[type=range] {
            width: 300px;
        }
    </style>
</head>
<body>

<div class="header">Generated using the <a href="https://github.com/lquesada/ComfyUI-Prompt-Combinator">ComfyUI Prompt Combinator</a> nodes</div>
<div class="zoom-controls">
    Zoom <input type="range" id="zoom-slider" min="10" max="300" value="100">
    <button id="reset-zoom">Set to 100%</button>
    <button id="auto-zoom-device">Fit device screen</button>
    <button id="auto-zoom-window">Fit window</button>
</div>
<div id="button-container"></div>
<div class="image-container" id="image-container">
    <img id="selected-image" src="">
    <div class="prompt" id="image-prompt"></div>
    <div class="filename" id="image-filename-container">(<a id="image-filename" href="" target="_blank"></a>)</div>
</div>

<script>
    // Fill these in from the node
    const ids1 = ['colorful', 'black and white', 'psychedelic'];
    const ids2 = ['picture', 'pencil', 'watercolor', 'cartoon', 'blueprint', '3d render'];
    const ids3 = ['dog', 'man', 'monster', 'airplane'];
    const ids4 = ['umbrella', 'icecream', 'book', 'flying'];
    const ids5 = null;
    const ids6 = null;
    const ids7 = null;
    const ids8 = null;
    const fileprefix = "example_files/img-";
    const filesuffix = ".webp";
    const images = [{ id: "colorful-picture-dog-umbrella----", filename: "example_files/img-colorful-picture-dog-umbrella----.webp", prompt: "colorful picture of a dog holding an umbrella"},{ id: "colorful-picture-dog-icecream----", filename: "example_files/img-colorful-picture-dog-icecream----.webp", prompt: "colorful picture of a dog eating icecream"},{ id: "colorful-picture-dog-book----", filename: "example_files/img-colorful-picture-dog-book----.webp", prompt: "colorful picture of a dog reading a book"},{ id: "colorful-picture-dog-flying----", filename: "example_files/img-colorful-picture-dog-flying----.webp", prompt: "colorful picture of a dog flying through the sky"},{ id: "colorful-picture-man-umbrella----", filename: "example_files/img-colorful-picture-man-umbrella----.webp", prompt: "colorful picture of a man holding an umbrella"},{ id: "colorful-picture-man-icecream----", filename: "example_files/img-colorful-picture-man-icecream----.webp", prompt: "colorful picture of a man eating icecream"},{ id: "colorful-picture-man-book----", filename: "example_files/img-colorful-picture-man-book----.webp", prompt: "colorful picture of a man reading a book"},{ id: "colorful-picture-man-flying----", filename: "example_files/img-colorful-picture-man-flying----.webp", prompt: "colorful picture of a man flying through the sky"},{ id: "colorful-picture-monster-umbrella----", filename: "example_files/img-colorful-picture-monster-umbrella----.webp", prompt: "colorful picture of a monster holding an umbrella"},{ id: "colorful-picture-monster-icecream----", filename: "example_files/img-colorful-picture-monster-icecream----.webp", prompt: "colorful picture of a monster eating icecream"},{ id: "colorful-picture-monster-book----", filename: "example_files/img-colorful-picture-monster-book----.webp", prompt: "colorful picture of a monster reading a book"},{ id: "colorful-picture-monster-flying----", filename: "example_files/img-colorful-picture-monster-flying----.webp", prompt: "colorful picture of a monster flying through the sky"},{ id: "colorful-picture-airplane-umbrella----", filename: "example_files/img-colorful-picture-airplane-umbrella----.webp", prompt: "colorful picture of an airplane holding an umbrella"},{ id: "colorful-picture-airplane-icecream----", filename: "example_files/img-colorful-picture-airplane-icecream----.webp", prompt: "colorful picture of an airplane eating icecream"},{ id: "colorful-picture-airplane-book----", filename: "example_files/img-colorful-picture-airplane-book----.webp", prompt: "colorful picture of an airplane reading a book"},{ id: "colorful-picture-airplane-flying----", filename: "example_files/img-colorful-picture-airplane-flying----.webp", prompt: "colorful picture of an airplane flying through the sky"},{ id: "colorful-pencil-dog-umbrella----", filename: "example_files/img-colorful-pencil-dog-umbrella----.webp", prompt: "colorful simple pencil sketch of a dog holding an umbrella"},{ id: "colorful-pencil-dog-icecream----", filename: "example_files/img-colorful-pencil-dog-icecream----.webp", prompt: "colorful simple pencil sketch of a dog eating icecream"},{ id: "colorful-pencil-dog-book----", filename: "example_files/img-colorful-pencil-dog-book----.webp", prompt: "colorful simple pencil sketch of a dog reading a book"},{ id: "colorful-pencil-dog-flying----", filename: "example_files/img-colorful-pencil-dog-flying----.webp", prompt: "colorful simple pencil sketch of a dog flying through the sky"},{ id: "colorful-pencil-man-umbrella----", filename: "example_files/img-colorful-pencil-man-umbrella----.webp", prompt: "colorful simple pencil sketch of a man holding an umbrella"},{ id: "colorful-pencil-man-icecream----", filename: "example_files/img-colorful-pencil-man-icecream----.webp", prompt: "colorful simple pencil sketch of a man eating icecream"},{ id: "colorful-pencil-man-book----", filename: "example_files/img-colorful-pencil-man-book----.webp", prompt: "colorful simple pencil sketch of a man reading a book"},{ id: "colorful-pencil-man-flying----", filename: "example_files/img-colorful-pencil-man-flying----.webp", prompt: "colorful simple pencil sketch of a man flying through the sky"},{ id: "colorful-pencil-monster-umbrella----", filename: "example_files/img-colorful-pencil-monster-umbrella----.webp", prompt: "colorful simple pencil sketch of a monster holding an umbrella"},{ id: "colorful-pencil-monster-icecream----", filename: "example_files/img-colorful-pencil-monster-icecream----.webp", prompt: "colorful simple pencil sketch of a monster eating icecream"},{ id: "colorful-pencil-monster-book----", filename: "example_files/img-colorful-pencil-monster-book----.webp", prompt: "colorful simple pencil sketch of a monster reading a book"},{ id: "colorful-pencil-monster-flying----", filename: "example_files/img-colorful-pencil-monster-flying----.webp", prompt: "colorful simple pencil sketch of a monster flying through the sky"},{ id: "colorful-pencil-airplane-umbrella----", filename: "example_files/img-colorful-pencil-airplane-umbrella----.webp", prompt: "colorful simple pencil sketch of an airplane holding an umbrella"},{ id: "colorful-pencil-airplane-icecream----", filename: "example_files/img-colorful-pencil-airplane-icecream----.webp", prompt: "colorful simple pencil sketch of an airplane eating icecream"},{ id: "colorful-pencil-airplane-book----", filename: "example_files/img-colorful-pencil-airplane-book----.webp", prompt: "colorful simple pencil sketch of an airplane reading a book"},{ id: "colorful-pencil-airplane-flying----", filename: "example_files/img-colorful-pencil-airplane-flying----.webp", prompt: "colorful simple pencil sketch of an airplane flying through the sky"},{ id: "colorful-watercolor-dog-umbrella----", filename: "example_files/img-colorful-watercolor-dog-umbrella----.webp", prompt: "colorful watercolor painting of a dog holding an umbrella"},{ id: "colorful-watercolor-dog-icecream----", filename: "example_files/img-colorful-watercolor-dog-icecream----.webp", prompt: "colorful watercolor painting of a dog eating icecream"},{ id: "colorful-watercolor-dog-book----", filename: "example_files/img-colorful-watercolor-dog-book----.webp", prompt: "colorful watercolor painting of a dog reading a book"},{ id: "colorful-watercolor-dog-flying----", filename: "example_files/img-colorful-watercolor-dog-flying----.webp", prompt: "colorful watercolor painting of a dog flying through the sky"},{ id: "colorful-watercolor-man-umbrella----", filename: "example_files/img-colorful-watercolor-man-umbrella----.webp", prompt: "colorful watercolor painting of a man holding an umbrella"},{ id: "colorful-watercolor-man-icecream----", filename: "example_files/img-colorful-watercolor-man-icecream----.webp", prompt: "colorful watercolor painting of a man eating icecream"},{ id: "colorful-watercolor-man-book----", filename: "example_files/img-colorful-watercolor-man-book----.webp", prompt: "colorful watercolor painting of a man reading a book"},{ id: "colorful-watercolor-man-flying----", filename: "example_files/img-colorful-watercolor-man-flying----.webp", prompt: "colorful watercolor painting of a man flying through the sky"},{ id: "colorful-watercolor-monster-umbrella----", filename: "example_files/img-colorful-watercolor-monster-umbrella----.webp", prompt: "colorful watercolor painting of a monster holding an umbrella"},{ id: "colorful-watercolor-monster-icecream----", filename: "example_files/img-colorful-watercolor-monster-icecream----.webp", prompt: "colorful watercolor painting of a monster eating icecream"},{ id: "colorful-watercolor-monster-book----", filename: "example_files/img-colorful-watercolor-monster-book----.webp", prompt: "colorful watercolor painting of a monster reading a book"},{ id: "colorful-watercolor-monster-flying----", filename: "example_files/img-colorful-watercolor-monster-flying----.webp", prompt: "colorful watercolor painting of a monster flying through the sky"},{ id: "colorful-watercolor-airplane-umbrella----", filename: "example_files/img-colorful-watercolor-airplane-umbrella----.webp", prompt: "colorful watercolor painting of an airplane holding an umbrella"},{ id: "colorful-watercolor-airplane-icecream----", filename: "example_files/img-colorful-watercolor-airplane-icecream----.webp", prompt: "colorful watercolor painting of an airplane eating icecream"},{ id: "colorful-watercolor-airplane-book----", filename: "example_files/img-colorful-watercolor-airplane-book----.webp", prompt: "colorful watercolor painting of an airplane reading a book"},{ id: "colorful-watercolor-airplane-flying----", filename: "example_files/img-colorful-watercolor-airplane-flying----.webp", prompt: "colorful watercolor painting of an airplane flying through the sky"},{ id: "colorful-cartoon-dog-umbrella----", filename: "example_files/img-colorful-cartoon-dog-umbrella----.webp", prompt: "colorful animated cartoon still of a dog holding an umbrella"},{ id: "colorful-cartoon-dog-icecream----", filename: "example_files/img-colorful-cartoon-dog-icecream----.webp", prompt: "colorful animated cartoon still of a dog eating icecream"},{ id: "colorful-cartoon-dog-book----", filename: "example_files/img-colorful-cartoon-dog-book----.webp", prompt: "colorful animated cartoon still of a dog reading a book"},{ id: "colorful-cartoon-dog-flying----", filename: "example_files/img-colorful-cartoon-dog-flying----.webp", prompt: "colorful animated cartoon still of a dog flying through the sky"},{ id: "colorful-cartoon-man-umbrella----", filename: "example_files/img-colorful-cartoon-man-umbrella----.webp", prompt: "colorful animated cartoon still of a man holding an umbrella"},{ id: "colorful-cartoon-man-icecream----", filename: "example_files/img-colorful-cartoon-man-icecream----.webp", prompt: "colorful animated cartoon still of a man eating icecream"},{ id: "colorful-cartoon-man-book----", filename: "example_files/img-colorful-cartoon-man-book----.webp", prompt: "colorful animated cartoon still of a man reading a book"},{ id: "colorful-cartoon-man-flying----", filename: "example_files/img-colorful-cartoon-man-flying----.webp", prompt: "colorful animated cartoon still of a man flying through the sky"},{ id: "colorful-cartoon-monster-umbrella----", filename: "example_files/img-colorful-cartoon-monster-umbrella----.webp", prompt: "colorful animated cartoon still of a monster holding an umbrella"},{ id: "colorful-cartoon-monster-icecream----", filename: "example_files/img-colorful-cartoon-monster-icecream----.webp", prompt: "colorful animated cartoon still of a monster eating icecream"},{ id: "colorful-cartoon-monster-book----", filename: "example_files/img-colorful-cartoon-monster-book----.webp", prompt: "colorful animated cartoon still of a monster reading a book"},{ id: "colorful-cartoon-monster-flying----", filename: "example_files/img-colorful-cartoon-monster-flying----.webp", prompt: "colorful animated cartoon still of a monster flying through the sky"},{ id: "colorful-cartoon-airplane-umbrella----", filename: "example_files/img-colorful-cartoon-airplane-umbrella----.webp", prompt: "colorful animated cartoon still of an airplane holding an umbrella"},{ id: "colorful-cartoon-airplane-icecream----", filename: "example_files/img-colorful-cartoon-airplane-icecream----.webp", prompt: "colorful animated cartoon still of an airplane eating icecream"},{ id: "colorful-cartoon-airplane-book----", filename: "example_files/img-colorful-cartoon-airplane-book----.webp", prompt: "colorful animated cartoon still of an airplane reading a book"},{ id: "colorful-cartoon-airplane-flying----", filename: "example_files/img-colorful-cartoon-airplane-flying----.webp", prompt: "colorful animated cartoon still of an airplane flying through the sky"},{ id: "colorful-blueprint-dog-umbrella----", filename: "example_files/img-colorful-blueprint-dog-umbrella----.webp", prompt: "colorful blueprint in orthographic projection of a dog holding an umbrella"},{ id: "colorful-blueprint-dog-icecream----", filename: "example_files/img-colorful-blueprint-dog-icecream----.webp", prompt: "colorful blueprint in orthographic projection of a dog eating icecream"},{ id: "colorful-blueprint-dog-book----", filename: "example_files/img-colorful-blueprint-dog-book----.webp", prompt: "colorful blueprint in orthographic projection of a dog reading a book"},{ id: "colorful-blueprint-dog-flying----", filename: "example_files/img-colorful-blueprint-dog-flying----.webp", prompt: "colorful blueprint in orthographic projection of a dog flying through the sky"},{ id: "colorful-blueprint-man-umbrella----", filename: "example_files/img-colorful-blueprint-man-umbrella----.webp", prompt: "colorful blueprint in orthographic projection of a man holding an umbrella"},{ id: "colorful-blueprint-man-icecream----", filename: "example_files/img-colorful-blueprint-man-icecream----.webp", prompt: "colorful blueprint in orthographic projection of a man eating icecream"},{ id: "colorful-blueprint-man-book----", filename: "example_files/img-colorful-blueprint-man-book----.webp", prompt: "colorful blueprint in orthographic projection of a man reading a book"},{ id: "colorful-blueprint-man-flying----", filename: "example_files/img-colorful-blueprint-man-flying----.webp", prompt: "colorful blueprint in orthographic projection of a man flying through the sky"},{ id: "colorful-blueprint-monster-umbrella----", filename: "example_files/img-colorful-blueprint-monster-umbrella----.webp", prompt: "colorful blueprint in orthographic projection of a monster holding an umbrella"},{ id: "colorful-blueprint-monster-icecream----", filename: "example_files/img-colorful-blueprint-monster-icecream----.webp", prompt: "colorful blueprint in orthographic projection of a monster eating icecream"},{ id: "colorful-blueprint-monster-book----", filename: "example_files/img-colorful-blueprint-monster-book----.webp", prompt: "colorful blueprint in orthographic projection of a monster reading a book"},{ id: "colorful-blueprint-monster-flying----", filename: "example_files/img-colorful-blueprint-monster-flying----.webp", prompt: "colorful blueprint in orthographic projection of a monster flying through the sky"},{ id: "colorful-blueprint-airplane-umbrella----", filename: "example_files/img-colorful-blueprint-airplane-umbrella----.webp", prompt: "colorful blueprint in orthographic projection of an airplane holding an umbrella"},{ id: "colorful-blueprint-airplane-icecream----", filename: "example_files/img-colorful-blueprint-airplane-icecream----.webp", prompt: "colorful blueprint in orthographic projection of an airplane eating icecream"},{ id: "colorful-blueprint-airplane-book----", filename: "example_files/img-colorful-blueprint-airplane-book----.webp", prompt: "colorful blueprint in orthographic projection of an airplane reading a book"},{ id: "colorful-blueprint-airplane-flying----", filename: "example_files/img-colorful-blueprint-airplane-flying----.webp", prompt: "colorful blueprint in orthographic projection of an airplane flying through the sky"},{ id: "colorful-3d render-dog-umbrella----", filename: "example_files/img-colorful-3d render-dog-umbrella----.webp", prompt: "colorful 3d render of a dog holding an umbrella"},{ id: "colorful-3d render-dog-icecream----", filename: "example_files/img-colorful-3d render-dog-icecream----.webp", prompt: "colorful 3d render of a dog eating icecream"},{ id: "colorful-3d render-dog-book----", filename: "example_files/img-colorful-3d render-dog-book----.webp", prompt: "colorful 3d render of a dog reading a book"},{ id: "colorful-3d render-dog-flying----", filename: "example_files/img-colorful-3d render-dog-flying----.webp", prompt: "colorful 3d render of a dog flying through the sky"},{ id: "colorful-3d render-man-umbrella----", filename: "example_files/img-colorful-3d render-man-umbrella----.webp", prompt: "colorful 3d render of a man holding an umbrella"},{ id: "colorful-3d render-man-icecream----", filename: "example_files/img-colorful-3d render-man-icecream----.webp", prompt: "colorful 3d render of a man eating icecream"},{ id: "colorful-3d render-man-book----", filename: "example_files/img-colorful-3d render-man-book----.webp", prompt: "colorful 3d render of a man reading a book"},{ id: "colorful-3d render-man-flying----", filename: "example_files/img-colorful-3d render-man-flying----.webp", prompt: "colorful 3d render of a man flying through the sky"},{ id: "colorful-3d render-monster-umbrella----", filename: "example_files/img-colorful-3d render-monster-umbrella----.webp", prompt: "colorful 3d render of a monster holding an umbrella"},{ id: "colorful-3d render-monster-icecream----", filename: "example_files/img-colorful-3d render-monster-icecream----.webp", prompt: "colorful 3d render of a monster eating icecream"},{ id: "colorful-3d render-monster-book----", filename: "example_files/img-colorful-3d render-monster-book----.webp", prompt: "colorful 3d render of a monster reading a book"},{ id: "colorful-3d render-monster-flying----", filename: "example_files/img-colorful-3d render-monster-flying----.webp", prompt: "colorful 3d render of a monster flying through the sky"},{ id: "colorful-3d render-airplane-umbrella----", filename: "example_files/img-colorful-3d render-airplane-umbrella----.webp", prompt: "colorful 3d render of an airplane holding an umbrella"},{ id: "colorful-3d render-airplane-icecream----", filename: "example_files/img-colorful-3d render-airplane-icecream----.webp", prompt: "colorful 3d render of an airplane eating icecream"},{ id: "colorful-3d render-airplane-book----", filename: "example_files/img-colorful-3d render-airplane-book----.webp", prompt: "colorful 3d render of an airplane reading a book"},{ id: "colorful-3d render-airplane-flying----", filename: "example_files/img-colorful-3d render-airplane-flying----.webp", prompt: "colorful 3d render of an airplane flying through the sky"},{ id: "black and white-picture-dog-umbrella----", filename: "example_files/img-black and white-picture-dog-umbrella----.webp", prompt: "black and white picture of a dog holding an umbrella"},{ id: "black and white-picture-dog-icecream----", filename: "example_files/img-black and white-picture-dog-icecream----.webp", prompt: "black and white picture of a dog eating icecream"},{ id: "black and white-picture-dog-book----", filename: "example_files/img-black and white-picture-dog-book----.webp", prompt: "black and white picture of a dog reading a book"},{ id: "black and white-picture-dog-flying----", filename: "example_files/img-black and white-picture-dog-flying----.webp", prompt: "black and white picture of a dog flying through the sky"},{ id: "black and white-picture-man-umbrella----", filename: "example_files/img-black and white-picture-man-umbrella----.webp", prompt: "black and white picture of a man holding an umbrella"},{ id: "black and white-picture-man-icecream----", filename: "example_files/img-black and white-picture-man-icecream----.webp", prompt: "black and white picture of a man eating icecream"},{ id: "black and white-picture-man-book----", filename: "example_files/img-black and white-picture-man-book----.webp", prompt: "black and white picture of a man reading a book"},{ id: "black and white-picture-man-flying----", filename: "example_files/img-black and white-picture-man-flying----.webp", prompt: "black and white picture of a man flying through the sky"},{ id: "black and white-picture-monster-umbrella----", filename: "example_files/img-black and white-picture-monster-umbrella----.webp", prompt: "black and white picture of a monster holding an umbrella"},{ id: "black and white-picture-monster-icecream----", filename: "example_files/img-black and white-picture-monster-icecream----.webp", prompt: "black and white picture of a monster eating icecream"},{ id: "black and white-picture-monster-book----", filename: "example_files/img-black and white-picture-monster-book----.webp", prompt: "black and white picture of a monster reading a book"},{ id: "black and white-picture-monster-flying----", filename: "example_files/img-black and white-picture-monster-flying----.webp", prompt: "black and white picture of a monster flying through the sky"},{ id: "black and white-picture-airplane-umbrella----", filename: "example_files/img-black and white-picture-airplane-umbrella----.webp", prompt: "black and white picture of an airplane holding an umbrella"},{ id: "black and white-picture-airplane-icecream----", filename: "example_files/img-black and white-picture-airplane-icecream----.webp", prompt: "black and white picture of an airplane eating icecream"},{ id: "black and white-picture-airplane-book----", filename: "example_files/img-black and white-picture-airplane-book----.webp", prompt: "black and white picture of an airplane reading a book"},{ id: "black and white-picture-airplane-flying----", filename: "example_files/img-black and white-picture-airplane-flying----.webp", prompt: "black and white picture of an airplane flying through the sky"},{ id: "black and white-pencil-dog-umbrella----", filename: "example_files/img-black and white-pencil-dog-umbrella----.webp", prompt: "black and white simple pencil sketch of a dog holding an umbrella"},{ id: "black and white-pencil-dog-icecream----", filename: "example_files/img-black and white-pencil-dog-icecream----.webp", prompt: "black and white simple pencil sketch of a dog eating icecream"},{ id: "black and white-pencil-dog-book----", filename: "example_files/img-black and white-pencil-dog-book----.webp", prompt: "black and white simple pencil sketch of a dog reading a book"},{ id: "black and white-pencil-dog-flying----", filename: "example_files/img-black and white-pencil-dog-flying----.webp", prompt: "black and white simple pencil sketch of a dog flying through the sky"},{ id: "black and white-pencil-man-umbrella----", filename: "example_files/img-black and white-pencil-man-umbrella----.webp", prompt: "black and white simple pencil sketch of a man holding an umbrella"},{ id: "black and white-pencil-man-icecream----", filename: "example_files/img-black and white-pencil-man-icecream----.webp", prompt: "black and white simple pencil sketch of a man eating icecream"},{ id: "black and white-pencil-man-book----", filename: "example_files/img-black and white-pencil-man-book----.webp", prompt: "black and white simple pencil sketch of a man reading a book"},{ id: "black and white-pencil-man-flying----", filename: "example_files/img-black and white-pencil-man-flying----.webp", prompt: "black and white simple pencil sketch of a man flying through the sky"},{ id: "black and white-pencil-monster-umbrella----", filename: "example_files/img-black and white-pencil-monster-umbrella----.webp", prompt: "black and white simple pencil sketch of a monster holding an umbrella"},{ id: "black and white-pencil-monster-icecream----", filename: "example_files/img-black and white-pencil-monster-icecream----.webp", prompt: "black and white simple pencil sketch of a monster eating icecream"},{ id: "black and white-pencil-monster-book----", filename: "example_files/img-black and white-pencil-monster-book----.webp", prompt: "black and white simple pencil sketch of a monster reading a book"},{ id: "black and white-pencil-monster-flying----", filename: "example_files/img-black and white-pencil-monster-flying----.webp", prompt: "black and white simple pencil sketch of a monster flying through the sky"},{ id: "black and white-pencil-airplane-umbrella----", filename: "example_files/img-black and white-pencil-airplane-umbrella----.webp", prompt: "black and white simple pencil sketch of an airplane holding an umbrella"},{ id: "black and white-pencil-airplane-icecream----", filename: "example_files/img-black and white-pencil-airplane-icecream----.webp", prompt: "black and white simple pencil sketch of an airplane eating icecream"},{ id: "black and white-pencil-airplane-book----", filename: "example_files/img-black and white-pencil-airplane-book----.webp", prompt: "black and white simple pencil sketch of an airplane reading a book"},{ id: "black and white-pencil-airplane-flying----", filename: "example_files/img-black and white-pencil-airplane-flying----.webp", prompt: "black and white simple pencil sketch of an airplane flying through the sky"},{ id: "black and white-watercolor-dog-umbrella----", filename: "example_files/img-black and white-watercolor-dog-umbrella----.webp", prompt: "black and white watercolor painting of a dog holding an umbrella"},{ id: "black and white-watercolor-dog-icecream----", filename: "example_files/img-black and white-watercolor-dog-icecream----.webp", prompt: "black and white watercolor painting of a dog eating icecream"},{ id: "black and white-watercolor-dog-book----", filename: "example_files/img-black and white-watercolor-dog-book----.webp", prompt: "black and white watercolor painting of a dog reading a book"},{ id: "black and white-watercolor-dog-flying----", filename: "example_files/img-black and white-watercolor-dog-flying----.webp", prompt: "black and white watercolor painting of a dog flying through the sky"},{ id: "black and white-watercolor-man-umbrella----", filename: "example_files/img-black and white-watercolor-man-umbrella----.webp", prompt: "black and white watercolor painting of a man holding an umbrella"},{ id: "black and white-watercolor-man-icecream----", filename: "example_files/img-black and white-watercolor-man-icecream----.webp", prompt: "black and white watercolor painting of a man eating icecream"},{ id: "black and white-watercolor-man-book----", filename: "example_files/img-black and white-watercolor-man-book----.webp", prompt: "black and white watercolor painting of a man reading a book"},{ id: "black and white-watercolor-man-flying----", filename: "example_files/img-black and white-watercolor-man-flying----.webp", prompt: "black and white watercolor painting of a man flying through the sky"},{ id: "black and white-watercolor-monster-umbrella----", filename: "example_files/img-black and white-watercolor-monster-umbrella----.webp", prompt: "black and white watercolor painting of a monster holding an umbrella"},{ id: "black and white-watercolor-monster-icecream----", filename: "example_files/img-black and white-watercolor-monster-icecream----.webp", prompt: "black and white watercolor painting of a monster eating icecream"},{ id: "black and white-watercolor-monster-book----", filename: "example_files/img-black and white-watercolor-monster-book----.webp", prompt: "black and white watercolor painting of a monster reading a book"},{ id: "black and white-watercolor-monster-flying----", filename: "example_files/img-black and white-watercolor-monster-flying----.webp", prompt: "black and white watercolor painting of a monster flying through the sky"},{ id: "black and white-watercolor-airplane-umbrella----", filename: "example_files/img-black and white-watercolor-airplane-umbrella----.webp", prompt: "black and white watercolor painting of an airplane holding an umbrella"},{ id: "black and white-watercolor-airplane-icecream----", filename: "example_files/img-black and white-watercolor-airplane-icecream----.webp", prompt: "black and white watercolor painting of an airplane eating icecream"},{ id: "black and white-watercolor-airplane-book----", filename: "example_files/img-black and white-watercolor-airplane-book----.webp", prompt: "black and white watercolor painting of an airplane reading a book"},{ id: "black and white-watercolor-airplane-flying----", filename: "example_files/img-black and white-watercolor-airplane-flying----.webp", prompt: "black and white watercolor painting of an airplane flying through the sky"},{ id: "black and white-cartoon-dog-umbrella----", filename: "example_files/img-black and white-cartoon-dog-umbrella----.webp", prompt: "black and white animated cartoon still of a dog holding an umbrella"},{ id: "black and white-cartoon-dog-icecream----", filename: "example_files/img-black and white-cartoon-dog-icecream----.webp", prompt: "black and white animated cartoon still of a dog eating icecream"},{ id: "black and white-cartoon-dog-book----", filename: "example_files/img-black and white-cartoon-dog-book----.webp", prompt: "black and white animated cartoon still of a dog reading a book"},{ id: "black and white-cartoon-dog-flying----", filename: "example_files/img-black and white-cartoon-dog-flying----.webp", prompt: "black and white animated cartoon still of a dog flying through the sky"},{ id: "black and white-cartoon-man-umbrella----", filename: "example_files/img-black and white-cartoon-man-umbrella----.webp", prompt: "black and white animated cartoon still of a man holding an umbrella"},{ id: "black and white-cartoon-man-icecream----", filename: "example_files/img-black and white-cartoon-man-icecream----.webp", prompt: "black and white animated cartoon still of a man eating icecream"},{ id: "black and white-cartoon-man-book----", filename: "example_files/img-black and white-cartoon-man-book----.webp", prompt: "black and white animated cartoon still of a man reading a book"},{ id: "black and white-cartoon-man-flying----", filename: "example_files/img-black and white-cartoon-man-flying----.webp", prompt: "black and white animated cartoon still of a man flying through the sky"},{ id: "black and white-cartoon-monster-umbrella----", filename: "example_files/img-black and white-cartoon-monster-umbrella----.webp", prompt: "black and white animated cartoon still of a monster holding an umbrella"},{ id: "black and white-cartoon-monster-icecream----", filename: "example_files/img-black and white-cartoon-monster-icecream----.webp", prompt: "black and white animated cartoon still of a monster eating icecream"},{ id: "black and white-cartoon-monster-book----", filename: "example_files/img-black and white-cartoon-monster-book----.webp", prompt: "black and white animated cartoon still of a monster reading a book"},{ id: "black and white-cartoon-monster-flying----", filename: "example_files/img-black and white-cartoon-monster-flying----.webp", prompt: "black and white animated cartoon still of a monster flying through the sky"},{ id: "black and white-cartoon-airplane-umbrella----", filename: "example_files/img-black and white-cartoon-airplane-umbrella----.webp", prompt: "black and white animated cartoon still of an airplane holding an umbrella"},{ id: "black and white-cartoon-airplane-icecream----", filename: "example_files/img-black and white-cartoon-airplane-icecream----.webp", prompt: "black and white animated cartoon still of an airplane eating icecream"},{ id: "black and white-cartoon-airplane-book----", filename: "example_files/img-black and white-cartoon-airplane-book----.webp", prompt: "black and white animated cartoon still of an airplane reading a book"},{ id: "black and white-cartoon-airplane-flying----", filename: "example_files/img-black and white-cartoon-airplane-flying----.webp", prompt: "black and white animated cartoon still of an airplane flying through the sky"},{ id: "black and white-blueprint-dog-umbrella----", filename: "example_files/img-black and white-blueprint-dog-umbrella----.webp", prompt: "black and white blueprint in orthographic projection of a dog holding an umbrella"},{ id: "black and white-blueprint-dog-icecream----", filename: "example_files/img-black and white-blueprint-dog-icecream----.webp", prompt: "black and white blueprint in orthographic projection of a dog eating icecream"},{ id: "black and white-blueprint-dog-book----", filename: "example_files/img-black and white-blueprint-dog-book----.webp", prompt: "black and white blueprint in orthographic projection of a dog reading a book"},{ id: "black and white-blueprint-dog-flying----", filename: "example_files/img-black and white-blueprint-dog-flying----.webp", prompt: "black and white blueprint in orthographic projection of a dog flying through the sky"},{ id: "black and white-blueprint-man-umbrella----", filename: "example_files/img-black and white-blueprint-man-umbrella----.webp", prompt: "black and white blueprint in orthographic projection of a man holding an umbrella"},{ id: "black and white-blueprint-man-icecream----", filename: "example_files/img-black and white-blueprint-man-icecream----.webp", prompt: "black and white blueprint in orthographic projection of a man eating icecream"},{ id: "black and white-blueprint-man-book----", filename: "example_files/img-black and white-blueprint-man-book----.webp", prompt: "black and white blueprint in orthographic projection of a man reading a book"},{ id: "black and white-blueprint-man-flying----", filename: "example_files/img-black and white-blueprint-man-flying----.webp", prompt: "black and white blueprint in orthographic projection of a man flying through the sky"},{ id: "black and white-blueprint-monster-umbrella----", filename: "example_files/img-black and white-blueprint-monster-umbrella----.webp", prompt: "black and white blueprint in orthographic projection of a monster holding an umbrella"},{ id: "black and white-blueprint-monster-icecream----", filename: "example_files/img-black and white-blueprint-monster-icecream----.webp", prompt: "black and white blueprint in orthographic projection of a monster eating icecream"},{ id: "black and white-blueprint-monster-book----", filename: "example_files/img-black and white-blueprint-monster-book----.webp", prompt: "black and white blueprint in orthographic projection of a monster reading a book"},{ id: "black and white-blueprint-monster-flying----", filename: "example_files/img-black and white-blueprint-monster-flying----.webp", prompt: "black and white blueprint in orthographic projection of a monster flying through the sky"},{ id: "black and white-blueprint-airplane-umbrella----", filename: "example_files/img-black and white-blueprint-airplane-umbrella----.webp", prompt: "black and white blueprint in orthographic projection of an airplane holding an umbrella"},{ id: "black and white-blueprint-airplane-icecream----", filename: "example_files/img-black and white-blueprint-airplane-icecream----.webp", prompt: "black and white blueprint in orthographic projection of an airplane eating icecream"},{ id: "black and white-blueprint-airplane-book----", filename: "example_files/img-black and white-blueprint-airplane-book----.webp", prompt: "black and white blueprint in orthographic projection of an airplane reading a book"},{ id: "black and white-blueprint-airplane-flying----", filename: "example_files/img-black and white-blueprint-airplane-flying----.webp", prompt: "black and white blueprint in orthographic projection of an airplane flying through the sky"},{ id: "black and white-3d render-dog-umbrella----", filename: "example_files/img-black and white-3d render-dog-umbrella----.webp", prompt: "black and white 3d render of a dog holding an umbrella"},{ id: "black and white-3d render-dog-icecream----", filename: "example_files/img-black and white-3d render-dog-icecream----.webp", prompt: "black and white 3d render of a dog eating icecream"},{ id: "black and white-3d render-dog-book----", filename: "example_files/img-black and white-3d render-dog-book----.webp", prompt: "black and white 3d render of a dog reading a book"},{ id: "black and white-3d render-dog-flying----", filename: "example_files/img-black and white-3d render-dog-flying----.webp", prompt: "black and white 3d render of a dog flying through the sky"},{ id: "black and white-3d render-man-umbrella----", filename: "example_files/img-black and white-3d render-man-umbrella----.webp", prompt: "black and white 3d render of a man holding an umbrella"},{ id: "black and white-3d render-man-icecream----", filename: "example_files/img-black and white-3d render-man-icecream----.webp", prompt: "black and white 3d render of a man eating icecream"},{ id: "black and white-3d render-man-book----", filename: "example_files/img-black and white-3d render-man-book----.webp", prompt: "black and white 3d render of a man reading a book"},{ id: "black and white-3d render-man-flying----", filename: "example_files/img-black and white-3d render-man-flying----.webp", prompt: "black and white 3d render of a man flying through the sky"},{ id: "black and white-3d render-monster-umbrella----", filename: "example_files/img-black and white-3d render-monster-umbrella----.webp", prompt: "black and white 3d render of a monster holding an umbrella"},{ id: "black and white-3d render-monster-icecream----", filename: "example_files/img-black and white-3d render-monster-icecream----.webp", prompt: "black and white 3d render of a monster eating icecream"},{ id: "black and white-3d render-monster-book----", filename: "example_files/img-black and white-3d render-monster-book----.webp", prompt: "black and white 3d render of a monster reading a book"},{ id: "black and white-3d render-monster-flying----", filename: "example_files/img-black and white-3d render-monster-flying----.webp", prompt: "black and white 3d render of a monster flying through the sky"},{ id: "black and white-3d render-airplane-umbrella----", filename: "example_files/img-black and white-3d render-airplane-umbrella----.webp", prompt: "black and white 3d render of an airplane holding an umbrella"},{ id: "black and white-3d render-airplane-icecream----", filename: "example_files/img-black and white-3d render-airplane-icecream----.webp", prompt: "black and white 3d render of an airplane eating icecream"},{ id: "black and white-3d render-airplane-book----", filename: "example_files/img-black and white-3d render-airplane-book----.webp", prompt: "black and white 3d render of an airplane reading a book"},{ id: "black and white-3d render-airplane-flying----", filename: "example_files/img-black and white-3d render-airplane-flying----.webp", prompt: "black and white 3d render of an airplane flying through the sky"},{ id: "psychedelic-picture-dog-umbrella----", filename: "example_files/img-psychedelic-picture-dog-umbrella----.webp", prompt: "psychedelic picture of a dog holding an umbrella"},{ id: "psychedelic-picture-dog-icecream----", filename: "example_files/img-psychedelic-picture-dog-icecream----.webp", prompt: "psychedelic picture of a dog eating icecream"},{ id: "psychedelic-picture-dog-book----", filename: "example_files/img-psychedelic-picture-dog-book----.webp", prompt: "psychedelic picture of a dog reading a book"},{ id: "psychedelic-picture-dog-flying----", filename: "example_files/img-psychedelic-picture-dog-flying----.webp", prompt: "psychedelic picture of a dog flying through the sky"},{ id: "psychedelic-picture-man-umbrella----", filename: "example_files/img-psychedelic-picture-man-umbrella----.webp", prompt: "psychedelic picture of a man holding an umbrella"},{ id: "psychedelic-picture-man-icecream----", filename: "example_files/img-psychedelic-picture-man-icecream----.webp", prompt: "psychedelic picture of a man eating icecream"},{ id: "psychedelic-picture-man-book----", filename: "example_files/img-psychedelic-picture-man-book----.webp", prompt: "psychedelic picture of a man reading a book"},{ id: "psychedelic-picture-man-flying----", filename: "example_files/img-psychedelic-picture-man-flying----.webp", prompt: "psychedelic picture of a man flying through the sky"},{ id: "psychedelic-picture-monster-umbrella----", filename: "example_files/img-psychedelic-picture-monster-umbrella----.webp", prompt: "psychedelic picture of a monster holding an umbrella"},{ id: "psychedelic-picture-monster-icecream----", filename: "example_files/img-psychedelic-picture-monster-icecream----.webp", prompt: "psychedelic picture of a monster eating icecream"},{ id: "psychedelic-picture-monster-book----", filename: "example_files/img-psychedelic-picture-monster-book----.webp", prompt: "psychedelic picture of a monster reading a book"},{ id: "psychedelic-picture-monster-flying----", filename: "example_files/img-psychedelic-picture-monster-flying----.webp", prompt: "psychedelic picture of a monster flying through the sky"},{ id: "psychedelic-picture-airplane-umbrella----", filename: "example_files/img-psychedelic-picture-airplane-umbrella----.webp", prompt: "psychedelic picture of an airplane holding an umbrella"},{ id: "psychedelic-picture-airplane-icecream----", filename: "example_files/img-psychedelic-picture-airplane-icecream----.webp", prompt: "psychedelic picture of an airplane eating icecream"},{ id: "psychedelic-picture-airplane-book----", filename: "example_files/img-psychedelic-picture-airplane-book----.webp", prompt: "psychedelic picture of an airplane reading a book"},{ id: "psychedelic-picture-airplane-flying----", filename: "example_files/img-psychedelic-picture-airplane-flying----.webp", prompt: "psychedelic picture of an airplane flying through the sky"},{ id: "psychedelic-pencil-dog-umbrella----", filename: "example_files/img-psychedelic-pencil-dog-umbrella----.webp", prompt: "psychedelic simple pencil sketch of a dog holding an umbrella"},{ id: "psychedelic-pencil-dog-icecream----", filename: "example_files/img-psychedelic-pencil-dog-icecream----.webp", prompt: "psychedelic simple pencil sketch of a dog eating icecream"},{ id: "psychedelic-pencil-dog-book----", filename: "example_files/img-psychedelic-pencil-dog-book----.webp", prompt: "psychedelic simple pencil sketch of a dog reading a book"},{ id: "psychedelic-pencil-dog-flying----", filename: "example_files/img-psychedelic-pencil-dog-flying----.webp", prompt: "psychedelic simple pencil sketch of a dog flying through the sky"},{ id: "psychedelic-pencil-man-umbrella----", filename: "example_files/img-psychedelic-pencil-man-umbrella----.webp", prompt: "psychedelic simple pencil sketch of a man holding an umbrella"},{ id: "psychedelic-pencil-man-icecream----", filename: "example_files/img-psychedelic-pencil-man-icecream----.webp", prompt: "psychedelic simple pencil sketch of a man eating icecream"},{ id: "psychedelic-pencil-man-book----", filename: "example_files/img-psychedelic-pencil-man-book----.webp", prompt: "psychedelic simple pencil sketch of a man reading a book"},{ id: "psychedelic-pencil-man-flying----", filename: "example_files/img-psychedelic-pencil-man-flying----.webp", prompt: "psychedelic simple pencil sketch of a man flying through the sky"},{ id: "psychedelic-pencil-monster-umbrella----", filename: "example_files/img-psychedelic-pencil-monster-umbrella----.webp", prompt: "psychedelic simple pencil sketch of a monster holding an umbrella"},{ id: "psychedelic-pencil-monster-icecream----", filename: "example_files/img-psychedelic-pencil-monster-icecream----.webp", prompt: "psychedelic simple pencil sketch of a monster eating icecream"},{ id: "psychedelic-pencil-monster-book----", filename: "example_files/img-psychedelic-pencil-monster-book----.webp", prompt: "psychedelic simple pencil sketch of a monster reading a book"},{ id: "psychedelic-pencil-monster-flying----", filename: "example_files/img-psychedelic-pencil-monster-flying----.webp", prompt: "psychedelic simple pencil sketch of a monster flying through the sky"},{ id: "psychedelic-pencil-airplane-umbrella----", filename: "example_files/img-psychedelic-pencil-airplane-umbrella----.webp", prompt: "psychedelic simple pencil sketch of an airplane holding an umbrella"},{ id: "psychedelic-pencil-airplane-icecream----", filename: "example_files/img-psychedelic-pencil-airplane-icecream----.webp", prompt: "psychedelic simple pencil sketch of an airplane eating icecream"},{ id: "psychedelic-pencil-airplane-book----", filename: "example_files/img-psychedelic-pencil-airplane-book----.webp", prompt: "psychedelic simple pencil sketch of an airplane reading a book"},{ id: "psychedelic-pencil-airplane-flying----", filename: "example_files/img-psychedelic-pencil-airplane-flying----.webp", prompt: "psychedelic simple pencil sketch of an airplane flying through the sky"},{ id: "psychedelic-watercolor-dog-umbrella----", filename: "example_files/img-psychedelic-watercolor-dog-umbrella----.webp", prompt: "psychedelic watercolor painting of a dog holding an umbrella"},{ id: "psychedelic-watercolor-dog-icecream----", filename: "example_files/img-psychedelic-watercolor-dog-icecream----.webp", prompt: "psychedelic watercolor painting of a dog eating icecream"},{ id: "psychedelic-watercolor-dog-book----", filename: "example_files/img-psychedelic-watercolor-dog-book----.webp", prompt: "psychedelic watercolor painting of a dog reading a book"},{ id: "psychedelic-watercolor-dog-flying----", filename: "example_files/img-psychedelic-watercolor-dog-flying----.webp", prompt: "psychedelic watercolor painting of a dog flying through the sky"},{ id: "psychedelic-watercolor-man-umbrella----", filename: "example_files/img-psychedelic-watercolor-man-umbrella----.webp", prompt: "psychedelic watercolor painting of a man holding an umbrella"},{ id: "psychedelic-watercolor-man-icecream----", filename: "example_files/img-psychedelic-watercolor-man-icecream----.webp", prompt: "psychedelic watercolor painting of a man eating icecream"},{ id: "psychedelic-watercolor-man-book----", filename: "example_files/img-psychedelic-watercolor-man-book----.webp", prompt: "psychedelic watercolor painting of a man reading a book"},{ id: "psychedelic-watercolor-man-flying----", filename: "example_files/img-psychedelic-watercolor-man-flying----.webp", prompt: "psychedelic watercolor painting of a man flying through the sky"},{ id: "psychedelic-watercolor-monster-umbrella----", filename: "example_files/img-psychedelic-watercolor-monster-umbrella----.webp", prompt: "psychedelic watercolor painting of a monster holding an umbrella"},{ id: "psychedelic-watercolor-monster-icecream----", filename: "example_files/img-psychedelic-watercolor-monster-icecream----.webp", prompt: "psychedelic watercolor painting of a monster eating icecream"},{ id: "psychedelic-watercolor-monster-book----", filename: "example_files/img-psychedelic-watercolor-monster-book----.webp", prompt: "psychedelic watercolor painting of a monster reading a book"},{ id: "psychedelic-watercolor-monster-flying----", filename: "example_files/img-psychedelic-watercolor-monster-flying----.webp", prompt: "psychedelic watercolor painting of a monster flying through the sky"},{ id: "psychedelic-watercolor-airplane-umbrella----", filename: "example_files/img-psychedelic-watercolor-airplane-umbrella----.webp", prompt: "psychedelic watercolor painting of an airplane holding an umbrella"},{ id: "psychedelic-watercolor-airplane-icecream----", filename: "example_files/img-psychedelic-watercolor-airplane-icecream----.webp", prompt: "psychedelic watercolor painting of an airplane eating icecream"},{ id: "psychedelic-watercolor-airplane-book----", filename: "example_files/img-psychedelic-watercolor-airplane-book----.webp", prompt: "psychedelic watercolor painting of an airplane reading a book"},{ id: "psychedelic-watercolor-airplane-flying----", filename: "example_files/img-psychedelic-watercolor-airplane-flying----.webp", prompt: "psychedelic watercolor painting of an airplane flying through the sky"},{ id: "psychedelic-cartoon-dog-umbrella----", filename: "example_files/img-psychedelic-cartoon-dog-umbrella----.webp", prompt: "psychedelic animated cartoon still of a dog holding an umbrella"},{ id: "psychedelic-cartoon-dog-icecream----", filename: "example_files/img-psychedelic-cartoon-dog-icecream----.webp", prompt: "psychedelic animated cartoon still of a dog eating icecream"},{ id: "psychedelic-cartoon-dog-book----", filename: "example_files/img-psychedelic-cartoon-dog-book----.webp", prompt: "psychedelic animated cartoon still of a dog reading a book"},{ id: "psychedelic-cartoon-dog-flying----", filename: "example_files/img-psychedelic-cartoon-dog-flying----.webp", prompt: "psychedelic animated cartoon still of a dog flying through the sky"},{ id: "psychedelic-cartoon-man-umbrella----", filename: "example_files/img-psychedelic-cartoon-man-umbrella----.webp", prompt: "psychedelic animated cartoon still of a man holding an umbrella"},{ id: "psychedelic-cartoon-man-icecream----", filename: "example_files/img-psychedelic-cartoon-man-icecream----.webp", prompt: "psychedelic animated cartoon still of a man eating icecream"},{ id: "psychedelic-cartoon-man-book----", filename: "example_files/img-psychedelic-cartoon-man-book----.webp", prompt: "psychedelic animated cartoon still of a man reading a book"},{ id: "psychedelic-cartoon-man-flying----", filename: "example_files/img-psychedelic-cartoon-man-flying----.webp", prompt: "psychedelic animated cartoon still of a man flying through the sky"},{ id: "psychedelic-cartoon-monster-umbrella----", filename: "example_files/img-psychedelic-cartoon-monster-umbrella----.webp", prompt: "psychedelic animated cartoon still of a monster holding an umbrella"},{ id: "psychedelic-cartoon-monster-icecream----", filename: "example_files/img-psychedelic-cartoon-monster-icecream----.webp", prompt: "psychedelic animated cartoon still of a monster eating icecream"},{ id: "psychedelic-cartoon-monster-book----", filename: "example_files/img-psychedelic-cartoon-monster-book----.webp", prompt: "psychedelic animated cartoon still of a monster reading a book"},{ id: "psychedelic-cartoon-monster-flying----", filename: "example_files/img-psychedelic-cartoon-monster-flying----.webp", prompt: "psychedelic animated cartoon still of a monster flying through the sky"},{ id: "psychedelic-cartoon-airplane-umbrella----", filename: "example_files/img-psychedelic-cartoon-airplane-umbrella----.webp", prompt: "psychedelic animated cartoon still of an airplane holding an umbrella"},{ id: "psychedelic-cartoon-airplane-icecream----", filename: "example_files/img-psychedelic-cartoon-airplane-icecream----.webp", prompt: "psychedelic animated cartoon still of an airplane eating icecream"},{ id: "psychedelic-cartoon-airplane-book----", filename: "example_files/img-psychedelic-cartoon-airplane-book----.webp", prompt: "psychedelic animated cartoon still of an airplane reading a book"},{ id: "psychedelic-cartoon-airplane-flying----", filename: "example_files/img-psychedelic-cartoon-airplane-flying----.webp", prompt: "psychedelic animated cartoon still of an airplane flying through the sky"},{ id: "psychedelic-blueprint-dog-umbrella----", filename: "example_files/img-psychedelic-blueprint-dog-umbrella----.webp", prompt: "psychedelic blueprint in orthographic projection of a dog holding an umbrella"},{ id: "psychedelic-blueprint-dog-icecream----", filename: "example_files/img-psychedelic-blueprint-dog-icecream----.webp", prompt: "psychedelic blueprint in orthographic projection of a dog eating icecream"},{ id: "psychedelic-blueprint-dog-book----", filename: "example_files/img-psychedelic-blueprint-dog-book----.webp", prompt: "psychedelic blueprint in orthographic projection of a dog reading a book"},{ id: "psychedelic-blueprint-dog-flying----", filename: "example_files/img-psychedelic-blueprint-dog-flying----.webp", prompt: "psychedelic blueprint in orthographic projection of a dog flying through the sky"},{ id: "psychedelic-blueprint-man-umbrella----", filename: "example_files/img-psychedelic-blueprint-man-umbrella----.webp", prompt: "psychedelic blueprint in orthographic projection of a man holding an umbrella"},{ id: "psychedelic-blueprint-man-icecream----", filename: "example_files/img-psychedelic-blueprint-man-icecream----.webp", prompt: "psychedelic blueprint in orthographic projection of a man eating icecream"},{ id: "psychedelic-blueprint-man-book----", filename: "example_files/img-psychedelic-blueprint-man-book----.webp", prompt: "psychedelic blueprint in orthographic projection of a man reading a book"},{ id: "psychedelic-blueprint-man-flying----", filename: "example_files/img-psychedelic-blueprint-man-flying----.webp", prompt: "psychedelic blueprint in orthographic projection of a man flying through the sky"},{ id: "psychedelic-blueprint-monster-umbrella----", filename: "example_files/img-psychedelic-blueprint-monster-umbrella----.webp", prompt: "psychedelic blueprint in orthographic projection of a monster holding an umbrella"},{ id: "psychedelic-blueprint-monster-icecream----", filename: "example_files/img-psychedelic-blueprint-monster-icecream----.webp", prompt: "psychedelic blueprint in orthographic projection of a monster eating icecream"},{ id: "psychedelic-blueprint-monster-book----", filename: "example_files/img-psychedelic-blueprint-monster-book----.webp", prompt: "psychedelic blueprint in orthographic projection of a monster reading a book"},{ id: "psychedelic-blueprint-monster-flying----", filename: "example_files/img-psychedelic-blueprint-monster-flying----.webp", prompt: "psychedelic blueprint in orthographic projection of a monster flying through the sky"},{ id: "psychedelic-blueprint-airplane-umbrella----", filename: "example_files/img-psychedelic-blueprint-airplane-umbrella----.webp", prompt: "psychedelic blueprint in orthographic projection of an airplane holding an umbrella"},{ id: "psychedelic-blueprint-airplane-icecream----", filename: "example_files/img-psychedelic-blueprint-airplane-icecream----.webp", prompt: "psychedelic blueprint in orthographic projection of an airplane eating icecream"},{ id: "psychedelic-blueprint-airplane-book----", filename: "example_files/img-psychedelic-blueprint-airplane-book----.webp", prompt: "psychedelic blueprint in orthographic projection of an airplane reading a book"},{ id: "psychedelic-blueprint-airplane-flying----", filename: "example_files/img-psychedelic-blueprint-airplane-flying----.webp", prompt: "psychedelic blueprint in orthographic projection of an airplane flying through the sky"},{ id: "psychedelic-3d render-dog-umbrella----", filename: "example_files/img-psychedelic-3d render-dog-umbrella----.webp", prompt: "psychedelic 3d render of a dog holding an umbrella"},{ id: "psychedelic-3d render-dog-icecream----", filename: "example_files/img-psychedelic-3d render-dog-icecream----.webp", prompt: "psychedelic 3d render of a dog eating icecream"},{ id: "psychedelic-3d render-dog-book----", filename: "example_files/img-psychedelic-3d render-dog-book----.webp", prompt: "psychedelic 3d render of a dog reading a book"},{ id: "psychedelic-3d render-dog-flying----", filename: "example_files/img-psychedelic-3d render-dog-flying----.webp", prompt: "psychedelic 3d render of a dog flying through the sky"},{ id: "psychedelic-3d render-man-umbrella----", filename: "example_files/img-psychedelic-3d render-man-umbrella----.webp", prompt: "psychedelic 3d render of a man holding an umbrella"},{ id: "psychedelic-3d render-man-icecream----", filename: "example_files/img-psychedelic-3d render-man-icecream----.webp", prompt: "psychedelic 3d render of a man eating icecream"},{ id: "psychedelic-3d render-man-book----", filename: "example_files/img-psychedelic-3d render-man-book----.webp", prompt: "psychedelic 3d render of a man reading a book"},{ id: "psychedelic-3d render-man-flying----", filename: "example_files/img-psychedelic-3d render-man-flying----.webp", prompt: "psychedelic 3d render of a man flying through the sky"},{ id: "psychedelic-3d render-monster-umbrella----", filename: "example_files/img-psychedelic-3d render-monster-umbrella----.webp", prompt: "psychedelic 3d render of a monster holding an umbrella"},{ id: "psychedelic-3d render-monster-icecream----", filename: "example_files/img-psychedelic-3d render-monster-icecream----.webp", prompt: "psychedelic 3d render of a monster eating icecream"},{ id: "psychedelic-3d render-monster-book----", filename: "example_files/img-psychedelic-3d render-monster-book----.webp", prompt: "psychedelic 3d render of a monster reading a book"},{ id: "psychedelic-3d render-monster-flying----", filename: "example_files/img-psychedelic-3d render-monster-flying----.webp", prompt: "psychedelic 3d render of a monster flying through the sky"},{ id: "psychedelic-3d render-airplane-umbrella----", filename: "example_files/img-psychedelic-3d render-airplane-umbrella----.webp", prompt: "psychedelic 3d render of an airplane holding an umbrella"},{ id: "psychedelic-3d render-airplane-icecream----", filename: "example_files/img-psychedelic-3d render-airplane-icecream----.webp", prompt: "psychedelic 3d render of an airplane eating icecream"},{ id: "psychedelic-3d render-airplane-book----", filename: "example_files/img-psychedelic-3d render-airplane-book----.webp", prompt: "psychedelic 3d render of an airplane reading a book"},{ id: "psychedelic-3d render-airplane-flying----", filename: "example_files/img-psychedelic-3d render-airplane-flying----.webp", prompt: "psychedelic 3d render of an airplane flying through the sky"},];
    const width = 512;
    const height = 512;
    const format = "webp";

    const defaultImage = images[0].filename;
    const idLists = [ids1, ids2, ids3, ids4, ids5, ids6, ids7, ids8];
    const selectedIds = idLists.map(list => list ? list[0] : null);

    const initialSelections = defaultImage.replace(fileprefix, '').replace(filesuffix, '').split('-');
    idLists.forEach((list, index) => {
        if (list && initialSelections[index]) {
            selectedIds[index] = initialSelections[index];
        }
    });

    const selectedClass = 'selected';

    function isValidCombination() {
        const selectedPath = selectedIds.map(id => id || '').join('-');
        const imagePath = `${fileprefix}${selectedPath}${filesuffix}`;
        return images.some(image => image.filename === imagePath);
    }

    function getImageData() {
        const selectedPath = selectedIds.map(id => id || '').join('-');
        const imagePath = `${fileprefix}${selectedPath}${filesuffix}`;
        return images.find(image => image.filename === imagePath);
    }

    function updateImage() {
        const imageContainer = document.getElementById('image-container');
        const selectedImage = document.getElementById('selected-image');
        const promptDiv = document.getElementById('image-prompt');
        const filenameLink = document.getElementById('image-filename');
        const filenameLinkContainer = document.getElementById('image-filename-container');
        const zoomSlider = document.getElementById('zoom-slider');

        const imageData = getImageData();

        if (!imageData) {
            // No valid combination selected, hide all elements and return
            selectedImage.style.display = 'none';
            promptDiv.style.display = 'none';
            filenameLink.style.display = 'none';
            filenameLinkContainer.style.display = 'none';
        } else {
            // Valid combination selected, show all elements
            selectedImage.style.display = 'block';
            promptDiv.style.display = 'block';
            filenameLink.style.display = 'inline';
            filenameLinkContainer.style.display = 'block';

            // Update the elements
            selectedImage.src = imageData.filename;
            selectedImage.style.width = `${width}px`;
            selectedImage.style.height = `${height}px`;
            promptDiv.textContent = imageData.prompt;
            filenameLink.textContent = `${imageData.id}.${format}`;
            filenameLink.href = imageData.filename;
            filenameLink.download = `${imageData.id}.${format}`;

            // Update zoom level
            setZoomLevel(zoomSlider.value);
        }

        preloadNearbyImages();
    }

    function createButtons(list, index) {
        if (!list) return;

        const container = document.createElement('div');
        container.className = 'buttons';

        list.forEach(id => {
            const button = document.createElement('div');
            button.className = 'button';
            if (id) {
                button.textContent = id;
            } else {
                button.innerHTML = '&nbsp;';
            }

            button.addEventListener('click', () => {
                document.querySelectorAll(`.buttons:nth-child(${index + 1}) .button`).forEach(btn => {
                    btn.classList.remove('selected', 'selected-disabled');
                });
                selectedIds[index] = id;
                updateButtonStates();
                updateImage();
            });

            container.appendChild(button);
        });

        document.getElementById('button-container').appendChild(container);
    }

    function updateButtonStates() {
        idLists.forEach((list, index) => {
            if (list) {
                const buttonsContainer = document.querySelector(`.buttons:nth-child(${index + 1})`);
                if (buttonsContainer) {
                    const buttons = buttonsContainer.querySelectorAll('.button');
                    list.forEach((id, idIndex) => {
                        const tempSelectedIds = [...selectedIds];
                        tempSelectedIds[index] = id;
                        const isValid = images.some(image => image.filename === `${fileprefix}${tempSelectedIds.map(id => id || '').join('-')}${filesuffix}`);
                        const button = buttons[idIndex];
                        if (button) {
                            button.classList.remove('disabled', 'selected', 'selected-disabled');
                            if (!isValid) {
                                button.classList.add('disabled');
                                if (id === selectedIds[index]) {
                                    button.classList.add('selected-disabled');
                                }
                            } else {
                                if (id === selectedIds[index]) {
                                    button.classList.add('selected');
                                }
                            }
                        }
                    });
                }
            }
        });
    }

    function preloadImage(src) {
        if (images.some(image => image.filename === src)) {
            const img = new Image();
            img.src = src;
        }
    }

    function preloadNearbyImages() {
        idLists.forEach((list, index) => {
            if (list) {
                list.forEach(id => {
                    const tempSelectedIds = [...selectedIds];
                    tempSelectedIds[index] = id;
                    const selectedPath = tempSelectedIds.map(id => id || '').join('-');
                    const imagePath = `${fileprefix}${selectedPath}${filesuffix}`;
                    preloadImage(imagePath);
                });
            }
        });
    }

    function setZoomLevel(zoom) {
        const selectedImage = document.getElementById('selected-image');
        selectedImage.style.width = `${width * (zoom / 100)}px`;
        selectedImage.style.height = `${height * (zoom / 100)}px`;
    }

    function setAutoZoomWindow() {
        const windowHeight = window.innerHeight;
        const headerHeight = 190; // Adjust as necessary for header height
        const footerHeight = 110; // Adjust as necessary for footer height
        const margin = 20; // Adjust as necessary for margins

        const availableHeight = windowHeight - headerHeight - footerHeight - margin;

        const imageAspectRatio = width / height;
        const windowAspectRatio = window.innerWidth / availableHeight;

        let zoomLevel;

        if (imageAspectRatio > windowAspectRatio) {
            zoomLevel = Math.min(200, Math.max(10, (window.innerWidth / width) * 100));
        } else {
            zoomLevel = Math.min(200, Math.max(10, (availableHeight / height) * 100));
        }

        document.getElementById('zoom-slider').value = zoomLevel;
        setZoomLevel(zoomLevel);
    }

    function setAutoZoomDevice() {
        const windowHeight = window.innerHeight;
        const margin = 100; // Adjust as necessary for margins
        const zoomLevel = Math.min(200, Math.max(10, (windowHeight - margin) / height * 100));
        document.getElementById('zoom-slider').value = zoomLevel;
        setZoomLevel(zoomLevel);
    }

    document.getElementById('zoom-slider').addEventListener('input', (event) => {
        setZoomLevel(event.target.value);
    });

    document.getElementById('reset-zoom').addEventListener('click', function() {
        document.getElementById('zoom-slider').value = 100;
        setZoomLevel(100);
    });

    document.getElementById('auto-zoom-window').addEventListener('click', setAutoZoomWindow);

    document.getElementById('auto-zoom-device').addEventListener('click', setAutoZoomDevice);

    idLists.forEach((list, index) => {
        if (list) {
            createButtons(list, index);
        }
    });

    updateButtonStates();
    updateImage();
    preloadNearbyImages(); // Preload images on initial load
</script>

</body>
</html>

